<template>
	<view class="VipMain">

		<view class="MainTip">
			请将会员码对准扫码口付款
		</view>

		<view class="box">
			<view class="BoxTitle">
				<view class="BoxTitleTop">
					账户余额：
					<view class="Money">
						￥{{user.balance}}
					</view>
				</view>
				<view class="BoxTitleTip">
					会员可享受会员价、积分等
				</view>
				<button type="default" class="ChonZhi" @click="Recharge">充值</button>

				<!-- 				<view class="tx-grid" @click="navTo('/pages/withdraw/index')"><span
						class="tx-grid-comm-sign">立即充值</span></view> -->
			</view>

			<view class="BoxXian"></view>

			<view class="EWMbox">
				<view class="" @click="ShowEWM" style="z-index: 2">
					<wQrcode :options="options2" @generate="ImgBack" v-if="imgUrl ==''"></wQrcode>
					<image :src="imgUrl" mode="scaleToFill" style="width: 260px;height: 260px;" v-else></image>
				</view>
				<view class="EWMText">
					{{options2.code.indexOf("&")==-1?options2.code:options2.code.split("&")[0]}}
				</view>
				<view class="EWMText2">
					会员条形码每60秒刷新，截图无效
				</view>
			</view>
		</view>


		<view style="width: 96vw;margin-top: 50rpx;">
			<view style="
		        background-color: #ffffff;
		        border-radius: 8px;
		        margin: 0 12px;
		        overflow: hidden;
		    ">
				<nx-can-use-coupon ref="picCoupon" v-if="couponData.useList.length || couponData.stopList.length"
					:discounts="couponDiscounts" :isShowCheck="true" :couponData="couponData" @changeTab="changeTab"
					@submitCoupon="submitCoupon" :noCouponShow="true"></nx-can-use-coupon>
			</view>
		</view>

		<!-- 		<view class="ToWeiXinPay" @click="OpenWXpay">
			<image src="../../static/Index/WeiXinPay.svg" mode="" class="ImagePay"></image>
			打开微信支付
		</view> -->



		<!-- 		<view class="white-box">
			<view class="tx">
				<view class="tx-grid">
					<view class="tx-grid-text">
						<view class="title">当前账号余额</view>
						<view class="money">
							<text>10</text>
							<text class="money-b">元</text>
						</view>
					</view>
				</view>
				<view class="tx-grid" @click="navTo('/pages/withdraw/index')"><span
						class="tx-grid-comm-sign">立即充值</span></view>
			</view>
			<view class="palace palace-one">
				<view class="palace-grid">
					<view class="palace-grid-text">
						<view class="palace-grid-text-data">
							<text>{{ userData.coming }}</text>
							<text class="palace-grid-text-data-b">元</text>
						</view>
						<view class="palace-grid-text-name">即将到账</view>
					</view>
				</view>
				<view class="palace-grid">
					<view class="palace-grid-text">
						<view class="palace-grid-text-data">
							<text>{{ userData.came }}</text>
							<text class="palace-grid-text-data-b">元</text>
						</view>
						<view class="palace-grid-text-name">累计到账</view>
					</view>
				</view>
				<view class="palace-grid">
					<view class="palace-grid-text">
						<view class="palace-grid-text-data">
							<text>{{ userData.withdrawed }}</text>
							<text class="palace-grid-text-data-b">元</text>
						</view>
						<view class="palace-grid-text-name">累计提现</view>
					</view>
				</view>
			</view>
		</view> -->

		<!-- 		<view class="ChuShiCode">
			请将会员码对准扫码口付款
		</view>
 -->

		<!-- 		<view class="VipCodeDiv">
			<view class="SmVipCodeDiv">
				<view class="VipCodeTitle">
					会员码每60秒刷新，截图无效
				</view>
				<wBarcode :options="options"></wBarcode>
			</view>
		</view> -->
		<!-- 弹出层 -->
		<uni-popup ref="popup1" type="center" class="page-red-envelope">
			<view class="imageBox">
				<image :src="imgUrl" mode="" style="height: 700rpx;width: 700rpx;z-index: 99999;"></image>
			</view>
		</uni-popup>

		<!-- 弹出层 -->
		<uni-popup ref="popup" type="bottom" class="page-red-envelope">
			<view class="box2">
				<view class="opened">
					<view class="bgc">
						<image class="bgc-img" src="/static/Index/bg2.png" mode="aspectFit" />
					</view>
					<view class="main">
						<view class="text-area">
							<button @click="showModal"
								style="background: linear-gradient(90deg,#dcb793,#f3dac0);color: #906b51;border-radius: 24px;font-size: 32rpx;padding: 5rpx 80rpx;"
								shadow>免费领取会员</button>
						</view>
					</view>
					<view class="btn" @click="close">
						<image class="b-img" src="/static/Index/btn-icon.png" mode="aspectFit" />
					</view>

				</view>
			</view>
		</uni-popup>

		<!-- 优惠券弹窗 -->
		<liiy-coupon-popup ref="coupon_pop" :content="content" :CouponList="CouponList" :theme="theme" :title="title"
			@getClick="handleGetClick()"></liiy-coupon-popup>
		<cart-animation ref="cartAnimation"></cart-animation>
	</view>
</template>

<script>
	import cartAnimation from 'uni_modules/f-cartAnimation/components/f-cartAnimation/f-cartAnimation.vue'
	import wBarcode from "uni_modules/wmf-code/components/w-barcode/w-barcode.vue"
	import wQrcode from "uni_modules/wmf-code/components/w-qrcode/w-qrcode.vue"
	import md5 from "common/md5.js"
	export default {
		components: {
			wBarcode,
			wQrcode,
			cartAnimation
		},

		data() {
			return {
				couponTab: 0,

				theme: 2,
				CouponList: [],
				content: "获得优惠券",
				title: "恭喜你",

				busPos: { // 自定义掉落坐标
					x: uni.getSystemInfoSync().windowWidth - 80,
					y: uni.getSystemInfoSync().windowHeight - 55
				},
				imgUrl: '',
				options: {
					width: 670, // 宽度 单位rpx
					height: 100, // 高度 单位rpx
					code: 'E57890543271985', // 生成条形码的值
					text: {
						content: 'E01181016286106',
						color: ['#000000'],
						position: 'bottom', //bottom
						size: 20,
						padding: 20
					}
				},
				options2: {
					code: '', // 生成二维码的值
					border: {
						color: ['#F27121', '#8A2387', '#1b82d2'], //边框颜色支持渐变色 最多10种颜色 如果默认黑色此属性不需要传
						opacity: 0.6, //边框透明度 默认为1不透明 0~1
						lineWidth: 6, //边框宽度
						degree: 15 //边框圆角度数 默认5
					},
					size: 520, // 460代表生成的二维码的宽高均为460rpx
				},
				user: {},
				time: null,
				couponDiscounts: '',
				// 优惠券
				couponData: {
					useList: [],
					stopList: []
				},
				CouponIdList: "",
				CouponStr: '',
				money: null,
				code: "",
			};
		},

		onShow() {


			this.haveUnionId()

			let token = wx.getStorageSync("token")

			if (token) {
				this.getVipScore()

				this.CreateVipCode(this.CouponStr)
				this.time = setInterval(() => {
					this.CreateVipCode(this.CouponStr)
				}, 20000)

				this.user = JSON.parse(wx.getStorageSync("user"))
				if (this.user.isVip == 0)
					this.$refs.popup.open('center')

				this.CouponUserList(1)
			}


			// this.CouponUserList(3)
		},
		onShareAppMessage(res) {
			let that = this;
			let imageUrl = that.shareUrl || '';
			if (res.from === 'button') {
				//这块需要传参，不然链接地址进去获取不到数据
				let path = `/` + that.$scope.route + `?item=` + that.$scope.options.item;
				return {
					title: '商品分享~',
					path: path,
					imageUrl: "http://175.178.150.60:97/static/img/222.png"
				};
			}
			if (res.from === 'menu') {
				return {
					title: '领取优惠券',
					path: '/pages/ToVipCode/ToVipCode?storeId=' + uni.getStorageSync("storeId"),
					imageUrl: "http://175.178.150.60:97/static/img/222.png"
				};
			}
		},
		// 分享到朋友圈
		onShareTimeline() {
			return {
				title: '领取优惠券',
				path: '/pages/ToVipCode/ToVipCode?storeId=' + uni.getStorageSync("storeId"),
				imageUrl: 'http://175.178.150.60:97/static/img/222.png'
			};
		},
		onLoad(option) {

			console.log('------', option);
			// 监听优惠券勾选
			this.$bus.$on('couponChecked', this.couponChecked)
			console.log(option.q);

			let token = wx.getStorageSync("token")
			// this.$refs.popup.open('center')
			if (token == '' || token == null || token == undefined) {
				//不存在则跳转至登录页
				let storeid;
				if (option.q) {
					try {
						const params = option.q.split("%3D");
						storeid = params[1]
					} catch (e) {
						//TODO handle the exception
					}
				}
				if (option.storeId) {
					storeid = option.storeId
				}

				uni.navigateTo({
					url: "/pages/login/login?type=ToVipCode&storeid=" + storeid
				})
				return;
			}

			if (option.q) {
				try {
					const params = option.q.split("%3D");
					console.log(params);
					console.log(22, params)

					if (params[1]) {
						console.log('1121', params[1])
						uni.setStorageSync("storeId", params[1]) // 就注册会员时候会用到
						this.CheckToThereCoupon("AfterScanCode")
					}

				} catch (e) {
					//TODO handle the exception
				}
			}

			if (option.money) {
				this.money = option.money
			}


			if (option.style == 1) {
				this.theme = 1
			} else {
				this.theme = 2
			}
			if (option.storeId) {
				uni.setStorageSync("storeId", option.storeId)
				this.CheckToThereCoupon("AfterScanCode")
			}

			if (option.type == 'AfterRecharge') {
				this.CheckToThereCoupon("AfterRecharge")
			}
			if (option.type == 'fanhui') {
				this.openMsg()
			}

			wx.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline'],
				success: function(res) {
					// 分享成功
					console.log('shareMenu share success')
					console.log('分享' + res)
				},
				fail: function(res) {
					// 分享失败
					console.log(res)
				}
			})






			if (option.BecameVip == 'ToVipCode') {
				this.showModal()
			}


		},
		destroyed() {
			clearInterval(this.time);
			this.time = null
		},
		onUnload() {
			// 移除监听事件
			clearInterval(this.time);
			this.time = null
			uni.$off('couponChecked')
		},
		onHide() {
			clearInterval(this.time);
			this.time = null
		},
		methods: {
			haveUnionId() {
				this.$request(this.$api.haveUnionId, null, "GET",
						false).then(res => {
						if (res.code == 200) {

							if (res.data == false) {
								uni.login({
									success: (res1) => {
										console.log(2, res1);
										this.code = res1.code;
										this.setUnionId()
									}
								})

							}
						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			setUnionId() {
				let url = this.$api.setUnionId +"?code=" +this.code
				this.$request(url, null, "GET",
						false).then(res => {
						if (res.code == 200) {

						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			close() {
				this.$refs.popup.close()

			},
			getVipScore() {
				this.$request(this.$api.getVipScore, null, "GET",
						false).then(res => {
						if (res.code == 200) {
							wx.setStorageSync("user", JSON.stringify(res.data))
							this.user = res.data
						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			queryGoodsById(Id) {
				let url = this.$api.queryGoodsById + "?Id=" + Id
				this.$request(url, null, "GET",
						false).then(res => {
						if (res.code == 200) {


						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			CheckToThereCoupon(status) {
				let data = {
					storeId: uni.getStorageSync("storeId"),
					status: status,
					money: this.money
				}
				this.$request(this.$api.CheckToThereCoupon, data, "POST",
						false).then(res => {
						if (res.code == 200) {
							if (res.data.length != 0) {
								let CouponIdList1 = []
								res.data.forEach(item => {

									if (item.type != "offerCoinCoupons") {
										let ruleFieldL = item.yzsActivityRuleList[0].ruleField.split(":")
										item.price = ruleFieldL[1]
										if (ruleFieldL[0] != 0)
											item.minPrice = ruleFieldL[0]
									} else {
										item.goodsName = item.yzsActivityRuleList[0].operationType
										item.num = item.yzsActivityRuleList[0].ruleField
									}
									item.name = item.activityName
									item.operationType = item.yzsActivityRuleList[0].operationType
									item.endData = item.yzsActivityRuleList[0].presentId
									CouponIdList1.push(item.activityId)
								})
								this.CouponList = res.data
								this.$refs.coupon_pop.show = true
								this.CouponIdList = CouponIdList1.join(",")

							}


						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			changeTab(index) {
				console.log('index', index)
				this.couponTab = index
				let type;
				if (this.couponTab == 0)
					type = 1
				else
					type = 3

				this.CouponUserList(type)
			},

			CouponUserList(type) {

				let url = this.$api.CouponUserList + '?type=' + type
				this.$request(url, null, "GET",
						false).then(res => {
						if (res.code == 200) {

							res.data.forEach(item => {

								if (item.type == "offerMinusCoupons") {
									// 满减券
									let ruleFieldL = item.ruleField.split(":")
									item.operationType = item.thresholdUnit

									item.discountsMaxAmount = ruleFieldL[1]
									if (ruleFieldL[0] != 0)
										item.discountsMinAmount = ruleFieldL[0]
								} else if (item.type == "offerFoldCoupons") {
									// 折扣券
									let ruleFieldL = item.ruleField.split(":")
									item.operationType = item.thresholdUnit
									item.discountsMaxAmount = Number(ruleFieldL[1]) * 10
									if (ruleFieldL[0] != 0)
										item.discountsMinAmount = ruleFieldL[0]
								} else if (item.type == "offerCoinCoupons") {
									item.goodsName = item.operationType
									item.num = item.ruleField
								}
								item.isAdditivity = 0

								item.source = item.activityName
								item.exchangeEndDate = item.expireTime
								item.exchangeStartDate = item.originTime
							})

							if (type == 1) {
								// 未使用
								this.couponData.useList = res.data
							} else if (type == 3) {
								// 已失效
								this.couponData.stopList = res.data
							}

							// 赋值且给checkbox给默认值
							this.couponData.useList = this.couponData.useList.map((item) => {
								let obj = {
									...item,
									checked: false, // 勾选
									topRightTip: false, //右上角提示
									bottomTip: false // 底部提示
								}
								return obj
							})

							let that = this
							if (this.$refs.picCoupon) {
								this.$refs.picCoupon.setUseData(that.couponData.useList)
								this.$refs.picCoupon.setStopList(that.couponData.stopList)
							}
							this.$forceUpdate()
						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			handleGetClick(event) {
				this.LinQuCoupon()
				this.$refs.coupon_pop.show = false
				this.$refs.cartAnimation.touchOnGoods(event, this.busPos)
			},
			LinQuCoupon() {

				let url = this.$api.LinQuCoupon + "?idList=" + this.CouponIdList
				this.$request(url, null, "GET",
						false).then(res => {
						if (res.code == 200) {

							this.CouponUserList(1)
						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})

			},
			showModal() {
				if (this.user.isVip == 0) {
					uni.showLoading({
						title: '加载中'
					});
					let storeId = uni.getStorageSync("storeId") // 就注册会员时候会用到
					let url = this.$api.BecameVip + '?storeId=' + storeId
					this.$request(url, null, "GET",
							false).then(res => {
							if (res.code == 200) {
								uni.hideLoading();
								this.$refs.popup.close()
								uni.showToast({
									title: "成功成为会员，现在你能享受会员特权了！",
								});
								this.user.isVip = 1
								uni.setStorageSync("user", JSON.stringify(this.user))

								this.CheckToThereCoupon("AfterBecameVIP")

							} else {
								uni.hideLoading();
								uni.showToast({
									title: res.description,
									icon: 'error'
								});
							}
						})
						.catch(res => {
							uni.hideLoading();
						})
				} else {

				}
			},
			submitCoupon(Select) {

				let data = Select[0]
				let ruleFieldL = data.ruleField.split(":")
				if (data.type == "offerMinusCoupons") {
					this.couponDiscounts = data.activityName + ":-￥" + ruleFieldL[1]
				} else if (data.type == "offerFoldCoupons") {
					// 折扣券
					this.couponDiscounts = data.activityName + ":" + Number(ruleFieldL[1]) * 10 + " 折"
				} else if (data.type == "offerCoinCoupons") {
					// 兑换券
					this.couponDiscounts = data.activityName + ":"
				}

				this.$forceUpdate()

				// 更新会员码，
				this.CouponStr = "&" + data.id
				this.CreateVipCode(this.CouponStr)

			},
			setCheckUseList(parameIndex, setBool, isAdd) {
				// isAdd是否可叠加 0 不可叠加 1 可叠加 2 所有 其他参数见下
				let that = this
				let tempArray = []
				that.couponData.useList.forEach((item, index) => {
					let obj = item
					let isAddBool = true
					if (isAdd == 0) {
						isAddBool = item.isAdditivity == 0 ? true : false
					} else if (isAdd == 1) {
						isAddBool = item.isAdditivity == 1
					}
					if (parameIndex != index && isAddBool) {
						obj.checked = setBool
					}

					tempArray.push(obj)
				})
				that.couponData.useList = tempArray
				if (this.$refs.picCoupon) {
					this.$refs.picCoupon.setUseData(tempArray)
				}
			},
			setDefaultUseList(parameIndex, topOrBot, setBool, isAdd) {
				// index, -1所有还是其他索引，topOrBoT（0：top，1:bot 2 二个都有 ）顶部或者底部的提示，setBool设置值成true或者false,isAdd是否可叠加 0 不可叠加 1 可叠加 2 所有
				let that = this
				// console.log('parameIndex', parameIndex);
				// console.log('topOrBot', topOrBot);
				// console.log('setBool', setBool);
				// console.log('isAdd', isAdd);
				let tempArray = []
				that.couponData.useList.forEach((item, index) => {
					let obj = item
					let isAddBool = true
					if (isAdd == 0) {
						isAddBool = item.isAdditivity == 0 ? true : false
					} else if (isAdd == 1) {
						isAddBool = item.isAdditivity == 1
					}
					if (parameIndex != index && isAddBool) {
						if (topOrBot == 0) {
							obj.topRightTip = setBool
						} else if (topOrBot == 1) {
							obj.bottomTip = setBool
						} else {
							obj.topRightTip = setBool
							obj.bottomTip = setBool
						}
					}

					tempArray.push(obj)
				})
				that.couponData.useList = tempArray
				if (this.$refs.picCoupon) {
					this.$refs.picCoupon.setUseData(tempArray)
				}
			},
			couponChecked(index) {
				let that = this
				console.log('index', index)
				console.log(
					'that.couponData.useList[index]',
					that.couponData.useList[index]
				)

				that.couponData.useList[index].checked = !that.couponData.useList[index].checked
				if (that.couponData.useList[index].checked) {
					// 勾选上
					console.log('勾选上')

					// 把自己的底部提示隐藏起来
					that.couponData.useList[index].bottomTip = false
					this.$refs.picCoupon.setUseData(that.couponData.useList)
					let isAdditivity = that.couponData.useList[index].isAdditivity // 勾选的是否可叠加
					if (isAdditivity) {
						// 可叠加
						console.log('可叠加')
						// 把所有不可以叠加的优惠券取消勾选
						that.setCheckUseList(-1, false, 0)
						// 把所有可以叠加的优惠券右上角提示显示出来
						that.setDefaultUseList(-1, 0, true, 1)
						// 把所有不可以叠加的优惠券底部提示显示出来
						that.setDefaultUseList(-1, 1, true, 0)
						// 把所有可以叠加的优惠券底部提示隐藏起来
						that.setDefaultUseList(-1, 1, false, 1)
					} else {
						// 不可叠加
						console.log('不可叠加')
						// 把其他所有优惠券取消勾选
						console.log('把其他所有优惠券取消勾选')
						that.setCheckUseList(index, false, 2)
						// 把所有可以叠加的优惠券右上角提示隐藏起来
						that.setDefaultUseList(-1, 0, false, 1)
						// 把其他所有优惠券底部提示显示出来
						that.setDefaultUseList(index, 1, true, 2)
					}
				} else {
					// 取消勾选
					console.log('取消勾选')
					let isAdditivity = that.couponData.useList[index].isAdditivity // 取消的是否可叠加
					if (isAdditivity) {
						// 可叠加
						let checkList = that.couponData.useList.map(
							(item) => item.checked
						) // 获取所有勾选的优惠券
						if (checkList.length == 0) {
							// 没有勾选的可叠加优惠券
							//去掉所有提示
							that.setDefaultUseList(-1, 2, false, 2)
						}
					} else {
						// 不可叠加
						//去掉所有提示
						that.setDefaultUseList(-1, 2, false, 2)
					}
				}
			},



			OpenWXpay() {
				console.log(111)
				let params = {
					appId: 'wx1196d47e1b4a311a',
					timeStamp: parseInt(new Date().getTime() / 1000) + '',
					nonceStr: this.creatNonceStr(),
					package: 'mch_id=1632894986',
					signType: 'MD5',
				}
				// 商户后台api Key
				let mchKey = 'b7f72247df8b3a53c7d537dc76f3a553'
				// 在拼接的参数后追加上api key
				let objStr = this.obj2str(params) + `&key=${mchKey}`
				console.log(objStr);
				// 进行MD5加密并转为大写
				let paySign = md5.toMd5Hex(objStr).toUpperCase()
				console.log(paySign);
				wx.openOfflinePayView({
					...params,
					paySign,
					success(res) {
						console.log('成功', res)
					},
					fail(err) {
						console.log('失败', err)
					},
					complete(e) {
						console.log('结束', e)
					}
				})

			},
			obj2str(args) {
				//获取参数对象的参数名集合
				var keys = Object.keys(args)
				//参数名ASCII码从小到大排序（字典序）
				keys = keys.sort()
				// 用于接收排序并过滤空值后的属性及值
				var newArgs = {}
				// 遍历赋值存储
				keys.forEach(function(key) {
					if (args[key] != "" && args[key] != 'undefined') { //如果参数的值为空不参与签名；
						newArgs[key] = args[key] //参数名区分大小写；
					}
				})
				//用于接收拼接的字符串
				var string = ''
				for (var k in newArgs) {
					string += '&' + k + '=' + newArgs[k]
				}
				// 截取字符串，只取第一个&符号后面的值
				string = string.substr(1)
				// 返回字符串，用于下一步加密
				return string
			},
			creatNonceStr(radix = 36) {
				// 将0-1随机小数，转换为radix进制，去掉0.，保留余下部分(这里可以自由发挥)
				return Math.random().toString(radix).substr(2, 15)
			},

			ShowEWM() {
				this.$refs.popup1.open("center")
			},
			ImgBack(e) {
				console.log(e);
				this.imgUrl = e.img.tempFilePath
			},
			getVipScore() {
				this.$request(this.$api.getVipScore, null, "GET",
						false).then(res => {
						if (res.code == 200) {
							this.user = res.data
							if (this.user.balance == null) {
								this.user.balance = 0
							}
							wx.setStorageSync("user", JSON.stringify(this.user))

						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			CreateVipCode(str) {
				this.$request(this.$api.CreateVipCode, null, "GET",
						false).then(res => {
						if (res.code == 200) {
							this.options2.code = res.data + str
							this.imgUrl = ''
						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			Recharge() {
				if (this.$api.Domain == "https://shht.wteam.club/api"){
					this.openMsg1()
						uni.navigateTo({
							url: "/pages/ToVipCode/recharge"
						})
				}

				else {
					this.openMsg()

				}
			},
			// 开启订阅消息
			openMsg1() {
				var that = this
				// 获取用户的当前设置，判断是否点击了“总是保持以上，不在询问”
				wx.getSetting({
					withSubscriptions: true, //是否获取用户订阅消息的订阅状态，默认false不返回
					success(res) {
						console.log(res)
						if (res.authSetting['scope.subscribeMessage']) { //用户点击了“总是保持以上，不再询问”
							uni.openSetting({ // 打开设置页
								success(res) {
									console.log(res.authSetting)
								}
							});
						} else { // 用户没有点击“总是保持以上，不再询问”则每次都会调起订阅消息
							var templateid = [
							'0oc4HEPsewJB-seRWZkQSqrOp53pPXZ-oI7DdyVFDEM',
							'M9lcU-OUzpH_97tsPSDzORV0f-iDE7VEmhC81r7qBDI'
							]
							uni.requestSubscribeMessage({
								tmplIds: templateid,
								success(res) {


									// wx.navigateToMiniProgram({
									// 	appId: 'wx30422a99e96e0c6a', //	小程序B的appid**
									// 	path: 'pages/cz/cz-list/index?id=' + that.user.id +
									// 		"&storeId=" + uni.getStorageSync(
									// 		"storeId"), //小程序B的页面路径**
									// 	success(res) {
									// 		// 打开成功
									// 	},
									// 	fail(res) {
									// 		//打开失败
									// 	}
									// })
								},
								fail: (res) => {
									console.log(res)
									// 他们小程序，就跳转到他们充值小程序

								}
							})
						}
					}
				})
			},


			// 开启订阅消息
			openMsg() {
				var that = this
				// 获取用户的当前设置，判断是否点击了“总是保持以上，不在询问”
				wx.getSetting({
					withSubscriptions: true, //是否获取用户订阅消息的订阅状态，默认false不返回
					success(res) {
						console.log(res)
						if (res.authSetting['scope.subscribeMessage']) { //用户点击了“总是保持以上，不再询问”
							uni.openSetting({ // 打开设置页
								success(res) {
									console.log(res.authSetting)
								}
							});
						} else { // 用户没有点击“总是保持以上，不再询问”则每次都会调起订阅消息
							var templateid = [
								'at3Oy9jcehC-klO9kJUvrFGdV6Lc-kGvrdUZQWR-RqE',
								'amRxJNM_wUd2uBpkz2txWWkk-jBPN3QQF6YwAd89ixE',
								'qpeHtYxuIq43KRhwVOX8XLc5QG9kHFO9MhVDx_HXEbE'
							]
							uni.requestSubscribeMessage({
								tmplIds: templateid,
								success(res) {
									// let successTempid = []
									// for (let i in res) {
									// 	if (res[i] == "accept") successTempid.push(i)
									// }
									// const data = {
									// 	openId: that.$store.state.userInfo.openId,
									// 	userId: that.$store.state.userInfo.userId,
									// 	templateIdListStr: successTempid.toString(),
									// }
									// console.log(data)
									// 他们小程序，就跳转到他们充值小程序


									wx.navigateToMiniProgram({
										appId: 'wx30422a99e96e0c6a', //	小程序B的appid**
										path: 'pages/cz/cz-list/index?id=' + that.user.id +
											"&storeId=" + uni.getStorageSync(
												"storeId"), //小程序B的页面路径**
										success(res) {
											// 打开成功
										}, 
										fail(res) {
											//打开失败
										}
									})
								},
								fail: (res) => {
									console.log(res)
									// 他们小程序，就跳转到他们充值小程序

									wx.navigateToMiniProgram({
										appId: 'wx30422a99e96e0c6a', //	小程序B的appid**
										path: 'pages/cz/cz-list/index?id=' + that.user
											.id, //小程序B的页面路径** 
										success(res) {
											// 打开成功
										},
										fail(res) {
											//打开失败
										}
									})
								}
							})
						}
					}
				})
			},















		}
	}
</script>

<style lang="scss">
	.vue-ref {
		padding-bottom: 0 !important;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.btn {
		text-align: center;
		position: relative;
		margin-top: 40rpx;

		.b-img {
			width: 67rpx;
			height: 67rpx;
		}
	}

	.box2 {
		position: relative;
		transition: transform 0.7s;
		z-index: 88;
		top: 200rpx;

		.opened {
			position: relative;
			width: 100vw;
			height: 100vh;
			padding-top: 125rpx;
			box-sizing: border-box;

			.bgc {

				height: 855rpx;

				.bgc-img {
					width: 100%;
					height: 100%;
					position: relative;
					right: 26rpx;
				}
			}



			.main {
				position: relative;
				text-align: center;
				z-index: 6;
				bottom: 218rpx;

				:deep(.ayi-button) {
					height: 90rpx !important;
					background: linear-gradient(to right, #dbb393, #f7dec3);
					border-radius: 45rpx !important;
				}

				:deep(.ayi-button__text) {
					font-size: 28rpx;
					font-weight: 400;
					color: #78482f;
				}
			}
		}
	}

	.VipMain {
		background-color: #426db5;
		height: 100vh;
		display: flex;
		flex-direction: column;
		align-items: center;

		.MainTip {
			margin-top: 6vh;
			color: white;
			font-size: 30rpx;
		}

		.ToWeiXinPay {
			display: flex;
			width: 450rpx;
			margin-top: 50rpx;
			align-items: center;
			justify-content: center;
			background: #22ac38;
			height: 72rpx;
			color: white;
			border-radius: 50rpx;
			font-size: 26rpx;

			.ImagePay {
				margin-right: 15rpx;
				width: 30rpx;
				height: 30rpx;
			}
		}

		.box {
			position: relative;
			width: 88vw;
			height: 68vh;
			background-color: #f1f1f1;
			margin-top: 4vh;
			border-radius: 10rpx;
			box-shadow: 0rpx 0rpx 9rpx #888888;
			display: flex;
			flex-direction: column;
			align-items: center;

			.BoxTitleTip {
				font-size: 24rpx;
				color: #81868e;
				position: relative;
				top: 30rpx;
			}

			.BoxTitle {
				height: 230rpx;
				display: flex;
				justify-content: center;
				// padding-top: 40rpx;
				font-size: 38rpx;
				flex-direction: column;
				align-items: center;

				.ChonZhi {
					height: 57rpx;
					font-size: 30rpx;
					line-height: normal;
					display: flex;
					align-items: center;
					justify-content: center;
					background: linear-gradient(to right, #fef082, #ffc551);
					color: #cf4400;
					width: 127rpx;
					/* margin-top: 30rpx; */
					position: absolute;
					right: -1rpx;
					border-radius: 40rpx 0 0 40rpx;
				}
			}

			.BoxTitleTop {
				display: flex;
				align-items: center;
				margin-top: -10rpx;


				.Money {
					color: #eb313e;
					font-size: 46rpx;
				}
			}
		}



		.EWMbox {
			display: flex;
			padding-top: 50rpx;
			justify-content: center;
			flex-direction: column;
			align-items: center;

			.EWMText {
				margin-top: 20rpx;
			}

			.EWMText2 {
				color: #bfbfbf;
				margin-top: 50rpx;
			}
		}

		.BoxXian {
			border-top: 2rpx dashed #bfbfbf;
			width: 90%;
			height: 1rpx;
			position: absolute;
			top: 235rpx;
		}

		.box::before,
		.box::after {
			content: "";
			position: absolute;
			top: 50rpx;
			width: 15px;
			height: 15px;
			background-color: #426db5;
			border-radius: 50%;
		}

		.box::before {
			left: 6vw;
			transform: translate(-200%, 550%);
		}

		.box::after {
			right: 6vw;
			transform: translate(200%, 550%);


		}

	}

	.VipCodeDiv {

		.SmVipCodeDiv {

			.VipCodeTitle {}

		}

	}

	.white-box {
		width: 94%;
		background: white;
		border-radius: 10rpx;
		margin: -120rpx auto 20rpx;
		box-shadow: 0 6rpx 20rpx #e7e7e7;

		.tx {
			padding-top: 26rpx;
			overflow: hidden;
			display: flex;
			justify-content: space-between;
			align-content: center;

			&-grid {
				box-sizing: border-box;

				&:first-child {
					margin-left: 40rpx;
				}

				&-comm-sign {
					display: block;
					border-radius: 40rpx 0 0 40rpx;
					font-size: 26rpx;
					padding: 16rpx 44rpx;
					background: linear-gradient(to right, #fef082, #ffc551);
					background-color: #fef082;
					color: #cf4400;
				}

				&-text {
					display: block;
					color: #333;
					font-size: 26rpx;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;

					.title {
						font-size: 26rpx;
						font-weight: normal;
						color: #ff6423;
					}

					.money {
						font-size: 60rpx;
						color: #ff6423;
						letter-spacing: 2rpx;
						margin-bottom: 10rpx;

						&-b {
							font-size: 28rpx;
						}
					}
				}
			}
		}

		.palace {
			padding-bottom: 20rpx;
			overflow: hidden;
			display: flex;
			justify-content: center;

			&-grid {
				flex: 1;
				position: relative;
				box-sizing: border-box;

				&:not(:last-child) {
					&:after {
						width: 1rpx;
						height: 80rpx;
						background: #fddece;
						content: ' ';
						display: inline-block;
						position: absolute;
						top: 0;
						right: 0;
					}
				}

				&-text {
					display: block;
					text-align: center;
					color: #333;
					font-size: 32rpx;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;

					&-name {
						font-size: 26rpx;
						font-weight: normal;
						color: #ff8a4a;
					}

					&-data {
						font-size: 32rpx;
						color: #ff8a4a;
						letter-spacing: 2rpx;
						margin-bottom: 5rpx;

						&-b {
							font-size: 20rpx;
						}
					}
				}
			}
		}
	}
</style>